fix(differentials): restore visible Safety Snapshot alert tint#468
Merged
Conversation
The Overview tab's Safety Snapshot banner used bg-[color:var(--danger-soft)]/50, which Tailwind compiles to color-mix(in oklab, var(--danger-soft) 50%, transparent). Since --danger-soft is already near-white (#fef3f2) in light mode, the 50% mix toward transparent rendered as an indistinguishable white strip instead of the intended red/pink emergent-status alert. Drop the opacity modifier to match every other --danger-soft usage in this file (full opacity).
|
This pull request has been ignored for the connected project Preview Branches by Supabase. |
Contributor
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
📝 WalkthroughSummary by CodeRabbit
WalkthroughThe SafetySnapshot container now uses the base danger-soft background color instead of the 50% opacity variant. ChangesSafety Snapshot Styling
Estimated code review effort: 1 (Trivial) | ~2 minutes 🚥 Pre-merge checks | ✅ 11✅ Passed checks (11 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
✨ Simplify code
Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
This was referenced Jul 11, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
/differentials/diagnoses/delirium) — the box meant to flagEMERGENTdiagnoses with a red/pink tint rendered as a plain white strip.bg-[color:var(--danger-soft)]/50compiles (Tailwind v4) tocolor-mix(in oklab, var(--danger-soft) 50%, transparent).--danger-softis already near-white in light mode (#fef3f2), so mixing it 50% toward transparent over the white page background is visually indistinguishable from no color at all. Traced to a flattening regression in6520dbf7("restyle: apply Clinical White / Aegean Graphite theme"); every other use of--danger-softin this file uses full opacity./50opacity modifier so the banner uses the design token at full strength, consistent with the rest ofdifferential-detail-page.tsx.Verification
npm run verify:cheap—check:runtime,check:github-actions,sitemap:check,lint, andtypecheckall passed clean. Thetest(vitest) step is flaky on this local machine independent of this change: 3 separate full runs each failed a different small set of tests (2–5 files), always viaError: Test timed out in 15000msin unrelated RAG/Supabase suites (e.g.rag-classifier-memo.test.ts, which explicitly documents a real-time memoization TTL window in its own source comment). This machine had 140+ concurrent Node processes from other sessions during the run. None of the flaky tests import or reference the changed file or component. Deferring to CI's isolated runner as the authoritative signal fortest.npx prettier --check src/components/differentials/differential-detail-page.tsx— passes (full-repoformat:checkflags two pre-existing, unrelated files —.claude/settings.jsonandCLAUDE.md— untouched by this diff and unchanged vs.origin/main).npm run ensure+npm run verify:ui(Chromium) — 115/124 passed. The 9 failures are all navigation/URL-timeout style failures spread across unrelated areas (services home, forms home, tablet rail, document search, differentials presentations comparison) — none touch the diagnosis Overview page or the changed component. Consistent with the same local resource-contention pattern seen in the vitest runs, not a functional regression from a single background-color class change.background-color: var(--danger-soft)(nocolor-mix) for the Safety Snapshot section, replacing the previous near-invisiblecolor-mix(in oklab, var(--danger-soft) 50%, transparent)rule.npm run verify:release— not run; out of scope for a single-line CSS fix.npm run eval:retrieval:quality— not run; no retrieval/ranking/selection/chunking/scoring behavior changed.npm run check:production-readiness— not run; no ingestion/answer-generation/privacy/env/Supabase behavior changed.Clinical Governance Preflight
Not applicable — this change is a pure CSS/Tailwind class edit to a client-side presentational component. It does not touch ingestion, answer generation, search/ranking, source rendering, document access, privacy, or production env behavior.
Notes
648abfa3f, a docs-only change fromclaude/differentials-search-ux-polish-f2ff06). Per user instruction, the branch was rebased ontoorigin/mainbefore pushing so this PR contains only the one CSS fix commit.